<template>
  <div class="tuijian-details">
    <el-breadcrumb separator=">">
      <el-breadcrumb-item :to="{ path: '/' }">系统首页</el-breadcrumb-item>
      <el-breadcrumb-item :to="{ path: '/selection' }">干部选任</el-breadcrumb-item>
      <el-breadcrumb-item :to="{ path: '/selection/candidateReport' }">事前报告</el-breadcrumb-item>
    </el-breadcrumb>
    <section class="wboxnoborder">
      <div :style="'height:'+tableHeight+'px'">
        <el-scrollbar style="height: calc(100% + 16px);">
          <el-form ref="form"
            label-width="120px"
            label-position="right"
            :inline="true" style="margin:15px 15px 0;">
            <el-form-item label="人选姓名">
              <span class="selectioncontent">
                {{params.realName}}
              </span>
            </el-form-item>
            <div style="clear:both"></div>
            <el-form-item label="动议岗位单位">
              <span class="selectioncontent">
                {{params.unitName}}
              </span>
            </el-form-item>
            <el-form-item label="动议岗位职务">
              <span class="selectioncontent">
                {{params.jobName}}
              </span>
            </el-form-item>
            <el-form-item label="动议岗位职级">
              <span class="selectioncontent">{{params.jobLevel}}</span>
            </el-form-item>
            <div style="clear:both"></div>
            <el-form-item label="目前单位">
              <span class="selectioncontent">
                {{params.candidateUnit}}
              </span>
            </el-form-item>
            <el-form-item label="目前职务">
              <span class="selectioncontent">
                {{params.currentJob}}
              </span>
            </el-form-item>
            <el-form-item label="目前职级">
              <span class="selectioncontent">{{params.currentLevel}}</span>
            </el-form-item>
          </el-form>
            <candidateReportDetail :personId='tuijianpersonId'></candidateReportDetail>
          <el-form ref="form"
            label-width="120px"
            label-position="right"
            :inline="true" style="margin:15px 0;">
            <div style="clear:both"></div>
            <el-form-item>
              <el-button type="primary" @click="backlist" style="margin-left:120px;">返回</el-button>
            </el-form-item>
          </el-form>
        </el-scrollbar>
      </div>
    </section>
  </div>
</template>

<script>
import candidateReportDetail from './detail'
export default {
  components: {
    candidateReportDetail
  },
  name: 'candidateReport-details',
  data () {
    return {
      tableHeight: 100,
      params: {
        candidateUnit: '',
        currentJob: '',
        currentLevel: '',
        personId: ''
      },
      tuijianForm: {
        comp: '',
        radio: '',
        thdate: '',
        thnum: '',
        thipt: '',
        thnum2: '',
        asyncItem: [
          {
            thnum: '',
            thipt: '',
            id: '001'
          }
        ],
        hydate: '',
        hynum: '',
        hyipt: '',
        hynum2: '',
        asyncItem2: [
          {
            hynum: '',
            hyipt: '',
            id: '00011'
          }
        ],
        beizhu: '',
        workgroup: ''
      },
      tuijianpersonId: 0,
      files: [],
      fileList: []
    }
  },
  methods: {
    inRoles (str) {
      console.log(str)
      let arr = JSON.parse(localStorage.getItem('Roles'))
      // arr = 'aaabbROLE_admin'
      if (arr.indexOf(str) === -1) {
        return false
      } else {
        return true
      }
    },
    backlist () {
      if (this.inRoles('ROLE_sizhang') || this.inRoles('ROLE_fusizhang')) {
        this.$router.replace({
          name: 'candidateReportLeader'
        })
      } else {
        this.$router.replace({
          name: 'candidateReport',
          params: {
            step: 2
          }
        })
      }
    },
    handleUploadSucc (response, file, fileList) {
      console.log(response)
      if (response.success) {
        this.files.push(response.result[0])
        this.$message({
          message: '上传成功！' + response.message,
          type: 'success'
        })
      } else {
        this.$message({
          message: '上传失败:' + response.message,
          type: 'error'
        })
      }
    },
    beforeRemove (file, fileList) {
      return this.$confirm(`确定移除 ${file.name}？`)
    },
    handleRemove (file, fileList) {
      console.log(file, fileList)
    },
    uploadError (err) {
      console.log(err)
      this.$message({
        message: '上传失败:' + err,
        type: 'error'
      })
    },
    addAsyncItem () {
      this.tuijianForm.asyncItem.push({
        thipt: '',
        thnum: '',
        id: Date.now()
      })
    },
    delAsyncItem (item) {
      var index = this.tuijianForm.asyncItem.indexOf(item)
      if (index !== -1) {
        this.tuijianForm.asyncItem.splice(index, 1)
      }
    },
    addAsyncItem2 () {
      this.tuijianForm.asyncItem2.push({
        hyipt: '',
        hynum: '',
        id: Date.now()
      })
    },
    delAsyncItem2 (item) {
      var index = this.tuijianForm.asyncItem2.indexOf(item)
      if (index !== -1) {
        this.tuijianForm.asyncItem2.splice(index, 1)
      }
    },
    formatFiles (files) {
      if (files && files.length > 0) {
        let newfiles = []
        for (let i = 0; i < files.length; i++) {
          newfiles.push({name: files[i].fileName + '.' + files[i].fileType, id: files[i].id})
        }
        console.log(newfiles)
        return newfiles
      }
    },
    tableresize (obj) {
      var clientHeight = 0
      if (document.body.clientHeight && document.documentElement.clientHeight) {
        clientHeight = (document.body.clientHeight < document.documentElement.clientHeight) ? document.body.clientHeight : document.documentElement.clientHeight
      } else {
        clientHeight = (document.body.clientHeight > document.documentElement.clientHeight) ? document.body.clientHeight : document.documentElement.clientHeight
      }
      obj.$nextTick(function () {
        obj.tableHeight = clientHeight - 165
      })
    }
  },
  mounted () {
    let params = this.$route.params
    console.log('busCandidatePersonId:')
    console.log(params.busCandidatePersonId)
    this.params = params
    this.params.personId = params.id
    if (params.id) {
      this.tuijianpersonId = params.id
    }
    if (params.busCandidatePersonId) {
      this.tuijianpersonId = params.busCandidatePersonId
    }
    this.tableresize(this)
    let _this = this
    window.onresize = function windowResize () {
      // 通过捕获系统的onresize事件触发我们需要执行的事件
      _this.tableresize(_this)
    }
  }
}
</script>
<style>
.tuijian-details .wboxnoborder .el-table{
  border: #95B8E7 solid 1px;
}
.tuijian-details .wboxnoborder .el-table th{
  font-weight: normal;
  background-image: linear-gradient(to bottom , #f8f8f8, #efefef);
  text-align: center;
  border-right: #95B8E7 solid 1px;
  border-bottom: #95B8E7 solid 1px;
  min-height: 30px;
  line-height:30px;
}
.tuijian-details .wboxnoborder .el-table td, .el-table th{
  padding:0;
  font-size:var(--size14) !important;
  line-height: 20px;
  font-family: '宋体';
  text-align: center;
}
.tuijian-details .el-table__row{
  height: 50px;
}
.tuijian-details .el-form-item__content{
  font-weight: bolder;
}
</style>
<style scoped>
.tuijian-details {
  width: 100%;
}
.sel-tit {
  width: 100%;
  height: 32px;
  line-height: 32px;
  padding: 0 15px;
  box-sizing: border-box;
  float: left;
  color: #303133;
  text-align: right;
  font-size: 16px;
}
.sel-con {
  width: 100%;
  height: 32px;
  line-height: 32px;
  padding: 0 15px;
  box-sizing: border-box;
  float: left;
  color: #909399;
  border-bottom: 0.5px solid #909399;
  font-size: 14px;
}
.tuijian-details .wboxnoborder {
  padding: 0;
  width: 100%;
  background-color: #fff;
  margin: 0 10px;
  overflow: hidden;
}
</style>
